import 'dart:io' show Platform;

import 'package:flutter/material.dart';

class CustomSlider extends StatefulWidget {
  @override
  _CustomSliderState createState() => _CustomSliderState();
}

class _CustomSliderState extends State<CustomSlider> {

  // final 不会被重新计算
  final _DiamondSliderThumShape _diamondSliderThumShape = _DiamondSliderThumShape();
  var value = 0.5;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("自定义控件"),
        leading: IconButton(
          icon: Icon(Icons.arrow_back),
          onPressed: (){
            Navigator.of(context).pop();
          },
        ),
      ),
      body: Container(
        child: Column(
          children: <Widget>[
            SliderTheme(
                data: SliderThemeData(
                  thumbShape: _diamondSliderThumShape
                ),
                child: Slider(
                value: value,
                onChanged: (val) {
                  setState(() {
                    value = val;
                  });
                },
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class _DiamondSliderThumShape extends SliderComponentShape {
  @override
  void paint(PaintingContext context, Offset center, {Animation<double> activationAnimation, Animation<double> enableAnimation, bool isDiscrete, TextPainter labelPainter, RenderBox parentBox, SliderThemeData sliderTheme, TextDirection textDirection, double value}) {
    Path diamond = Path()
      ..moveTo(center.dx, center.dy - 8)
      ..relativeLineTo(8, 8)
      ..relativeLineTo(-8, 8)
      ..relativeLineTo(-8, -8)
      ..close();
    Paint paint = Paint()
      ..color = sliderTheme.thumbColor;
    context.canvas.drawPath(diamond, paint);
  }

  @override
  Size getPreferredSize(bool isEnabled, bool isDiscrete) {
    return Size.zero;
  }
}

